<template>
  <div class="app-container home">
    <p class="welcome">WELCOME</p>
    <div class="title">
      <h1>欢迎进入</h1>
      <p>{{title}}</p>
    </div>
  </div>
</template>

<script>
export default {
  name: "Index",
  data() {
    return {
      // 版本号
      title: import.meta.env.VITE_APP_TITLE,
    };
  },
  methods: {
    goTarget(href) {
      window.open(href, "_blank");
    },
  },
};
</script>
<style type="text/css">
.home {
  background-image: url("../assets/images/Bitmap.png");
  background-repeat: no-repeat;
  background-size: 35%;
  background-position: 80% center;
  height: calc(100vh - 84px);
  position: relative;
}
</style>

<style scoped lang="scss">
  .home{
    background-image: url("../assets/images/Bitmap.png");
    background-repeat: no-repeat;
    background-size: 35%;
    background-position: 80% center;
    height: calc(100vh - 84px);
    position: relative;
    .welcome{
      opacity: 0.05;
      font-size: 70px;
      position: absolute;
      top: 36%;
      margin: 0;
      left: 70px;
    }
    .title{
      position: absolute;
      top: 40%;
      left: 70px;
      h1{font-size: 40px;
        line-height: 52px;
        font-weight: bold;
        margin: 0;
        margin-bottom: 10px;
        color: #101010;}
      p{
        font-size: 26px;
        color: #606060;
        line-height: 36px;
        margin: 0;
        letter-spacing: 0.93px;
      }

    }
  }
</style>

